<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>淋浴</title>
    <script src="font/iconfont.js"></script>
    <style>
        body{
            background-color: rgb(242, 242, 242);
            width: 100%;
        }
        h2,p,ul,body{
            padding: 0;
            margin: 0;
        }
        a{
            text-decoration: none;
            color: #000;
            margin-left: -13px;
        }
        img{
            margin: 0;
            padding: 0;
            width: 100%;
            border: none;
            z-index: 1;
        }
        .quit{
        width: 15px;
        height: 25px;  
        position: relative;
        left: 94%;
        bottom:120px;
        z-index: 9;
        }
        .sec{
            display: flex;
            width: 100%;
        }
        .com{
            width: 70%;
            height: 90px;
            background-color: #fff;
            margin-top: -25px;
            border-radius: 10px;
            overflow: hidden;
        }
        .pic{
            position: relative;
            bottom: 30px;
            left: 5px;
            width: 40px;
        }
        .text{
            position: relative;
            bottom: 126px;
            left: 50px;
            width: 200px;
        }
        .text h3{
            font-size: 12px;
            margin: 0;
        }
        .text span{
            color: rgb(145, 145, 145);
            font-size: 10px;
        }
        .saoma{
            margin-left: 20px;
        }
        .yushi{
            margin-left: 20px;
        }
        .function{
            width: 96%;
            height: 190px;
            background-color: rgb(255, 255, 255);
            margin-left: 2%;
            border-radius: 5px;
            margin-top: 10px;
        }
        .function li{
            list-style: none;
            display: flex;
            align-items: center;
            border-bottom:1px solid rgb(241, 241, 241);
            height: 25px;
            letter-spacing: 1px;
        }
        .function p,span{
            font-size: 13px;
        }
        .function p{
            padding-left: 5%;
            padding-bottom: 20px;
        }
        .function span{
            font-size: 10px;
            color: rgb(150, 150, 150);
            position: relative;
            left: 32%;
            bottom: 10px;
        }
        .function .icon_put{
            position: relative;
            left: 32%;
            bottom: 9px;
            width: 25px;
            height: 25px;
        }
        .function .last{
            border: none;
        }
        h2{
            width: 150px;
            font-size: 12px;
            color: rgb(163, 163, 163);
            position: relative;
        }

        #softNo{
            top: 90px;
            left: 36%;
        }
        #name{
            top: 90px;
            left: 48%;
        }
        #sno{
            top: 90px;
            left: 32%;
        }
    </style>
</head>
<body>
    <div class="title">
        <img src="./ad/linyu.jpg">
        <a href="./U1-index.html">
            <svg class="quit" aria-hidden="true">
                <use xlink:href="#icon-guanbi"></use>
            </svg>
        </a>
    </div>
    <div class="sec">
        <a href="#">
            <div class="com saoma">
                
                <svg class="pic" aria-hidden="true">
                    <use xlink:href="#icon-zhifu"></use>
                </svg>
                <div class="text">
                    <h3>扫码洗</h3>
                    <span class="auuthor">适用公共浴室</span>
                </div>
            </div>
        </a>
        <a href="#">
            <div class="com yushi">
                <svg class="pic" aria-hidden="true">
                    <use xlink:href="#icon-xizao"></use>
                </svg>
                <div class="text">
                    <h3>公共洗浴</h3>
                    <span class="auuthor">适用集中浴室</span>
                </div>
            </div>
        </a>
    </div>
    <div class="function">
        <a href="#">
            <li>
                <p>消费订单</p>
                <span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp查看订单</span>
                <svg class="icon_put" aria-hidden="true">
                    <use xlink:href="#icon-jiantou"></use>
                </svg>
            </li>
        </a>
        <a href="#">
            <li>
                <p>店铺小票</p>
                <span>购买/查询店铺小票</span>
                <svg class="icon_put" aria-hidden="true">
                    <use xlink:href="#icon-jiantou"></use>
                </svg>
            </li>
        </a>
        <a href="#">
            <li>
                <p>用水码</p>
                <span>&nbsp&nbsp&nbsp&nbsp仅限集中淋浴使用</span>
                <svg class="icon_put" aria-hidden="true">
                    <use xlink:href="#icon-jiantou"></use>
                </svg>
            </li>
        </a>
        <a href="#">
            <li class="last">
                <p>常见问题</p>
                <span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp各种解决方案</span>
                <svg class="icon_put" aria-hidden="true">
                    <use xlink:href="#icon-jiantou"></use>
                </svg>
            </li>
        </a>
    </div>
    <h2 id="name">成风</h4>
    <h2 id="sno">Wind</h5>
    <h2 id="softNo">版本号：V1.0.34</h2>
</body>
</html>